--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Node / ReticulumProjects / MeshChatX.git / files / meshchatx / src / frontend / components / Toast.vue
Displaying Raw • Download
meshchatx/src/frontend/components/Toast.vue 7d7cd7d48701e74ab38cef0db1eca1b0cd23cf87 (7d7cd7d4) Text, 3.93 KB
Tb4b4b4<Tff7b72templateTb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"fixed bottom-4 right-4 z-[100] flex flex-col gap-2 pointer-events-none"Tb4b4b4>
Tb4b4b4<Tff7b72TransitionGroup Te6edf3nameTff7b72=Ta5d6ff"toast"Tb4b4b4>
Tb4b4b4<Tff7b72div
Te6edf3v-forTff7b72=Ta5d6ff"Te6edf3toast Tff7b72in Te6edf3toastsTa5d6ff"
Tb4b4b4:Te6edf3keyTff7b72=Ta5d6ff"Te6edf3toastTb4b4b4.Te6edf3idTa5d6ff"
Te6edf3classTff7b72=Ta5d6ff"pointer-events-auto flex items-center p-4 min-w-[300px] max-w-md rounded-xl shadow-lg border backdrop-blur-md transition-all duration-300"
Tb4b4b4:Te6edf3classTff7b72=Ta5d6ff"Te6edf3toastClassTb4b4b4(Te6edf3toastTb4b4b4.Te6edf3typeTb4b4b4)Ta5d6ff"
Tb4b4b4>
T8b949e<!-- icon -->
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"mr-3 flex-shrink-0"Tb4b4b4>
Tb4b4b4<Tff7b72MaterialDesignIcon
Te6edf3v-ifTff7b72=Ta5d6ff"Te6edf3toastTb4b4b4.Te6edf3type Tff7b72=== Ta5d6ff'success'Ta5d6ff"
Te6edf3icon-nameTff7b72=Ta5d6ff"check-circle"
Te6edf3classTff7b72=Ta5d6ff"h-6 w-6 text-green-500"
Tb4b4b4/Tb4b4b4>
Tb4b4b4<Tff7b72MaterialDesignIcon
Te6edf3v-else-ifTff7b72=Ta5d6ff"Te6edf3toastTb4b4b4.Te6edf3type Tff7b72=== Ta5d6ff'error'Ta5d6ff"
Te6edf3icon-nameTff7b72=Ta5d6ff"alert-circle"
Te6edf3classTff7b72=Ta5d6ff"h-6 w-6 text-red-500"
Tb4b4b4/Tb4b4b4>
Tb4b4b4<Tff7b72MaterialDesignIcon
Te6edf3v-else-ifTff7b72=Ta5d6ff"Te6edf3toastTb4b4b4.Te6edf3type Tff7b72=== Ta5d6ff'warning'Ta5d6ff"
Te6edf3icon-nameTff7b72=Ta5d6ff"alert"
Te6edf3classTff7b72=Ta5d6ff"h-6 w-6 text-amber-500"
Tb4b4b4/Tb4b4b4>
Tb4b4b4<Tff7b72MaterialDesignIcon Te6edf3v-else Te6edf3icon-nameTff7b72=Ta5d6ff"information" Te6edf3classTff7b72=Ta5d6ff"h-6 w-6 text-blue-500" Tb4b4b4/Tb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
T8b949e<!-- content -->
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"flex-1 mr-2 text-sm font-medium text-gray-900 dark:text-zinc-100"Tb4b4b4>
Tff7b72{{ Te6edf3$tTb4b4b4(Te6edf3toastTb4b4b4.Te6edf3messageTb4b4b4) Tff7b72}}
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
T8b949e<!-- close button -->
Tb4b4b4<Tff7b72button
Te6edf3classTff7b72=Ta5d6ff"ml-auto text-gray-400 hover:text-gray-600 dark:hover:text-zinc-300"
Tb4b4b4@Te6edf3clickTff7b72=Ta5d6ff"Te6edf3removeTb4b4b4(Te6edf3toastTb4b4b4.Te6edf3idTb4b4b4)Ta5d6ff"
Tb4b4b4>
Tb4b4b4<Tff7b72MaterialDesignIcon Te6edf3icon-nameTff7b72=Ta5d6ff"close" Te6edf3classTff7b72=Ta5d6ff"h-4 w-4" Tb4b4b4/Tb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72buttonTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72TransitionGroupTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72templateTb4b4b4>
Tb4b4b4<Tff7b72scriptTb4b4b4>
Tff7b72import Te6edf3GlobalEmitter Tff7b72from Ta5d6ff"../js/GlobalEmitter"Tb4b4b4;
Tff7b72import Te6edf3MaterialDesignIcon Tff7b72from Ta5d6ff"./MaterialDesignIcon.vue"Tb4b4b4;
Tff7b72export Tff7b72default Tb4b4b4{
Te6edf3nameTff7b72: Ta5d6ff"Toast"Tb4b4b4,
Te6edf3componentsTff7b72: Tb4b4b4{
Te6edf3MaterialDesignIconTb4b4b4,
Tb4b4b4}Tb4b4b4,
Te6edf3dataTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72return Tb4b4b4{
Te6edf3toastsTff7b72: Tb4b4b4[Tb4b4b4]Tb4b4b4,
Te6edf3counterTff7b72: T79c0ff0Tb4b4b4,
Tb4b4b4}Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3mountedTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3toastHandler Tff7b72= Tb4b4b4(Te6edf3toastTb4b4b4) Tb4b4b4=> Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3addTb4b4b4(Te6edf3toastTb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4;
Te6edf3GlobalEmitterTb4b4b4.Te6edf3onTb4b4b4(Ta5d6ff"toast"Tb4b4b4, Tff7b72thisTb4b4b4.Te6edf3toastHandlerTb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3beforeUnmountTb4b4b4(Tb4b4b4) Tb4b4b4{
Te6edf3GlobalEmitterTb4b4b4.Te6edf3offTb4b4b4(Ta5d6ff"toast"Tb4b4b4, Tff7b72thisTb4b4b4.Te6edf3toastHandlerTb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3methodsTff7b72: Tb4b4b4{
Te6edf3addTb4b4b4(Te6edf3toastTb4b4b4) Tb4b4b4{
Tff7b72const Te6edf3id Tff7b72= Tff7b72thisTb4b4b4.Te6edf3counterTff7b72++Tb4b4b4;
Tff7b72const Te6edf3newToast Tff7b72= Tb4b4b4{
Te6edf3idTb4b4b4,
Te6edf3messageTff7b72: Te6edf3toastTb4b4b4.Te6edf3messageTb4b4b4,
Te6edf3typeTff7b72: Te6edf3toastTb4b4b4.Te6edf3type Tff7b72|| Ta5d6ff"info"Tb4b4b4,
Te6edf3durationTff7b72: Te6edf3toastTb4b4b4.Te6edf3duration Tff7b72|| T79c0ff5000Tb4b4b4,
Tb4b4b4}Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3toastsTb4b4b4.Te6edf3pushTb4b4b4(Te6edf3newToastTb4b4b4)Tb4b4b4;
Tff7b72if Tb4b4b4(Te6edf3newToastTb4b4b4.Te6edf3duration Tff7b72> T79c0ff0Tb4b4b4) Tb4b4b4{
Te6edf3setTimeoutTb4b4b4(Tb4b4b4(Tb4b4b4) Tb4b4b4=> Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3removeTb4b4b4(Te6edf3idTb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4, Te6edf3newToastTb4b4b4.Te6edf3durationTb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4,
Te6edf3removeTb4b4b4(Te6edf3idTb4b4b4) Tb4b4b4{
Tff7b72const Te6edf3index Tff7b72= Tff7b72thisTb4b4b4.Te6edf3toastsTb4b4b4.Te6edf3findIndexTb4b4b4(Tb4b4b4(Te6edf3tTb4b4b4) Tb4b4b4=> Te6edf3tTb4b4b4.Te6edf3id Tff7b72=== Te6edf3idTb4b4b4)Tb4b4b4;
Tff7b72if Tb4b4b4(Te6edf3index Tff7b72!== Tff7b72-T79c0ff1Tb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3toastsTb4b4b4.Te6edf3spliceTb4b4b4(Te6edf3indexTb4b4b4, T79c0ff1Tb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4,
Te6edf3toastClassTb4b4b4(Te6edf3typeTb4b4b4) Tb4b4b4{
Tff7b72switch Tb4b4b4(Te6edf3typeTb4b4b4) Tb4b4b4{
Tff7b72case Ta5d6ff"success"Tff7b72:
Tff7b72return Ta5d6ff"bg-white/90 dark:bg-zinc-900/90 border-green-500/30"Tb4b4b4;
Tff7b72case Ta5d6ff"error"Tff7b72:
Tff7b72return Ta5d6ff"bg-white/90 dark:bg-zinc-900/90 border-red-500/30"Tb4b4b4;
Tff7b72case Ta5d6ff"warning"Tff7b72:
Tff7b72return Ta5d6ff"bg-white/90 dark:bg-zinc-900/90 border-amber-500/30"Tb4b4b4;
Tff7b72defaultTff7b72:
Tff7b72return Ta5d6ff"bg-white/90 dark:bg-zinc-900/90 border-blue-500/30"Tb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4;
Tb4b4b4<Tb4b4b4/Tff7b72scriptTb4b4b4>
Tb4b4b4<Tff7b72style Te6edf3scopedTb4b4b4>
Tb4b4b4.T56d364toast-enter-activeTff7b72,
Tb4b4b4.T56d364toast-leave-active Tb4b4b4{
Tff7b72transitionTb4b4b4: Tff7b72all T79c0ff0.3Tffa657s Tff7b72easeTb4b4b4;
Tb4b4b4}
Tb4b4b4.T56d364toast-enter-from Tb4b4b4{
Tff7b72opacityTb4b4b4: T79c0ff0Tb4b4b4;
Tff7b72transformTb4b4b4: Tffa657translateXTb4b4b4(T79c0ff30Tffa657pxTb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4.T56d364toast-leave-to Tb4b4b4{
Tff7b72opacityTb4b4b4: T79c0ff0Tb4b4b4;
Tff7b72transformTb4b4b4: Tffa657translateXTb4b4b4(T79c0ff30Tffa657pxTb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4<Tb4b4b4/Tff7b72styleTb4b4b4>
──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────